<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div th:fragment="header">
    <!--  此处是引入公用js和css文件的地方  -->
    <link rel="shortcut icon" th:href="@{/images/favicon.ico}" type="image/x-icon"/>

    <link rel="stylesheet" th:href="@{/vendors/mdi/css/materialdesignicons.min.css}">
    <link rel="stylesheet" th:href="@{/css/common.css}">

    <script type="text/javascript" th:src="@{/common/jquery/4.0.0/jquery-4.0.0-beta.2.slim.min.js}"></script>
</div>
<div th:fragment="formPage">
    <link rel="stylesheet" th:href="@{/css/formPageComm.css}">
</div>
<div th:fragment="listPage">
    <link rel="stylesheet" th:href="@{/css/listPageComm.css}">
</div>
<div th:fragment="pageInfo">
    <div th:fragment="pager" id="pagination" class="ht_pagination" th:if="${vo.page.total}" th:object="${vo.page}">
        <ul class="pageList">
            <li class="first"><input type="submit" name="page_counter" th:value="1"></li>
            <li class="prev" th:if="*{pageNum>1}"><input type="submit" name="page_counter" th:value="*{pageNum-1}"></li>
            <li th:if="*{pageNum-6>0}">...</li>

            <li th:each="pageNo : *{#numbers.sequence(pageNum-5, pageNum+5)}" th:if="${pageNo>0 and pageNo<=vo.page.pages}"  th:class="${pageNo == vo.page.pageNum} ? 'current' :'' ">
                <input type="submit" name="page_counter" th:value="${pageNo}" />
            </li>

            <li th:if="*{pageNum+6<=pages}">...</li>
            <li class="next" th:if="*{pageNum+1<=pages}"><input type="submit" name="page_counter" th:value="*{pageNum+1}"></li>
            <li class="last"><input type="submit" name="page_counter" th:value="*{pages}"></li>
        </ul>
        <p>
            <label for="pageNum">跳转到：</label>
            <input type="text" name="pageNum" id="pageNum" size="3" maxlength="9" class="pageNum" th:value="*{pageNum}" required />
            <input type="submit" class="submitButton" value="GO">
            <input type="hidden" name="pageTotal" id="pageTotal" th:value="*{total}">
            <input type="hidden" name="pageSize"  id="pageSize"  th:value="*{pageSize}">
            <span class="tips">当前第 [[*{pageNum}]] 页/总 [[*{pages}]] 页，共有 [[*{total}]] 条信息</span>
        </p>
        <script>
            $("#pagination li [name=page_counter]").on("click",function(event){
                var target=event.currentTarget;
                var value=target.value;
                $("#pageNum").val(value)
            });
        </script>
    </div>
</div>
<div  th:fragment="loading">
    <div class="ht-masker open"></div>
    <div class="ht-loading open"><div class="wrapper"><p>请稍候</p></div></div>
</div>
<div th:fragment="backDialogMsg">
    <ul style="display: none;" id="backAlertMsg" th:if="${#fields.hasErrors('dto.*')}">
        <li th:each="err:${#fields.errors('dto.*')}" th:text="${err}"></li>
    </ul>
</div>
</body>
</html>